<template>
  <el-dialog title="添加会员" width="40%" :before-close="dialogClose" :visible.sync="show">
    <el-form ref="form" :model="form" label-width="100px">
        <el-form-item label="会员姓名">
          <el-input v-model="form.username" class="select_input"></el-input>
        </el-form-item>
        <el-form-item label="会员电话">
          <el-input v-model="form.phone" class="select_input"></el-input>
        </el-form-item>
        <el-form-item label="会员生日">
           <!--<el-date-picker
            @change="birthDayChage"
            v-model="form.birthDay"
            type="date"
            placeholder="会员生日" 
            format="yyyy-MM-dd"
            value-format="yyyy-MM-dd"
            >
          </el-date-picker>-->
          <el-input
            placeholder="2020"
            suffix-icon="el-icon-date"
            v-model="year"
            class="view_input"
            maxlength="4">
          </el-input>--
          <el-input
            placeholder="03"
            suffix-icon="el-icon-date"
            v-model="month"
            class="view_input"
            maxlength="2">
          </el-input>--
          <el-input
            placeholder="15"
            suffix-icon="el-icon-date"
            v-model="day"
            class="view_input"
            maxlength="2">
          </el-input>
        </el-form-item>
        <el-form-item label="结婚纪念日">
           <el-date-picker
            @change="marryDayChage"
            v-model="form.marryDay"
            type="date"
            placeholder="结婚纪念日" 
            format="yyyy-MM-dd"
            value-format="yyyy-MM-dd"
            >
          </el-date-picker>
        </el-form-item>
        <el-form-item label="子女生日">
           <el-date-picker
            @change="sonBirthDayChage"
            v-model="form.sonBirthDay"
            type="date"
            placeholder="子女生日" 
            format="yyyy-MM-dd"
            value-format="yyyy-MM-dd"
            >
          </el-date-picker>
        </el-form-item>
        <el-form-item label="会员等级">
          <el-select v-model="form.lv" placeholder="会员等级">
            <el-option v-for="(item,index) in cate" :key="index" :label="item.name" :value="item.lv"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="客户来源">
          <el-select v-model="form.source" placeholder="客户来源">
            <el-option v-for="(item,index) in sourceArr" :key="index" :label="item" :value="item"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="美容师">
          <el-select v-model="form.user_id" placeholder="美容师">
            <el-option v-for="(item,index) in userArr" :key="index" :label="item.realname" :value="item.uid"></el-option>
          </el-select>
        </el-form-item>
        <div align="center" class="dilog_footer">
          <el-button v-show="addTrue" type="primary" @click="userSubmit">确 定</el-button>
          <el-button v-show="!addTrue" type="info">确 定</el-button>
          <el-button @click="dialogClose">取 消</el-button>
        </div>
      </el-form>
    </el-dialog>
</template>
 
<script>
export default {
  name: 'userAdd',
  props:['show','userArr'],
  data() {
    return {
        cate:[
          {id:1,name:'A类会员',lv:'A'},
          {id:2,name:'B类会员',lv:'B'},
          {id:3,name:'C类会员',lv:'C'},
          {id:4,name:'D类会员',lv:'D'}
        ],
        sourceArr:['主动进店','大众点评','朋友推荐','地推拓客','小程序','异业联盟','其他'],
        form:{},
        addTrue:true,
        year:'',
        month:'',
        day:'',
        monthArr:['01','02','03','04','05','06','07','08','09','10','11','12'],
        dayArr:['01','02','03','04','05','06','07','08','09','10','11','12','13','14','15','16','17',
        '18','19','20','21','22','23','24','25','26','27','28','29','30','31']
    }
  },
  created: function() {
    
  },
  methods: {
    birthDayChage:function(e){
      this.form.birthDay = e
    },
    marryDayChage:function(e){
      this.form.marryDay = e
    },
    sonBirthDayChage:function(e){
      this.form.sonBirthDay = e
    },
    dialogClose:function(){
      this.$emit("func",{'key':'addShow'})
    },
    userSubmit:function(){
      var validate = {
        username:'会员姓名不能为空',
        phone:'会员手机号码必填',
        lv:'请选择会员等级',
        source:'请选择客户来源'
      }
      for(var x in validate){
        if(!this.form[x]){
          this.$message.error(validate[x]);
          return false;
          break;
        }
      }
      if(!this.year || !this.month || !this.day){
          this.$message.error('请输入会员生日');
          return false;
      }
      if(this.monthArr.indexOf(this.month) == '-1'){
          this.$message.error('请输入正确的月份格式');
          return false;
      }
      if(this.dayArr.indexOf(this.day) == '-1'){
          this.$message.error('请输入正确的日期格式');
          return false;
      }
      var that = this
      this.form.birthDay = this.year+'-'+this.month+'-'+this.day
      this.form.oa_id = localStorage.getItem('oa_id')
      this.addTrue = false
      this.$post('pc/user/add',this.form).then((res) => {
          if(res.code == 1){
            that.$message.success(res.msg);
            that.$emit("func",{'key':'addShow','type':1})
          }else{
            that.$message.error(res.msg);
          }
      })
    }
  }
}
</script>
<style>
.dilog_footer{
  position: fixed;
  top: 84%;
  right: 0;
  bottom: 0;
  left: 0;
  overflow: auto;
  margin: 0;
  width:100%;
}
.dilog_footer button{
  width:17%;
}
.view_input{
  width:100px !important;
  height:35px !important;
  line-height:35px !important;
}
</style>